<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>商城</title>
		<link rel="stylesheet" type="text/css" href="css/reset.css"/>
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
	</head>
	<!--
			vw: 1vw 屏幕宽度的百分之x
			vh: 1vh 屏幕高度的百分之x
			字体大小: vw
		-->
	<body>
		
		<div class="head">
			<div class="ld-wrapper">
				<img src="img/lingdang.png"/>
			</div>
			<span>
				Mall商城
			</span>
			<div class="right-wrapper">
				<img src="img/fangdajing.png"/>
				<img src="img/gouwuche.png"/>
			</div>
		</div>
		
		<!--中间部分开始-->
		<div class="centen-wrapper">
			<!--我的开始-->
			<div class="mine-wrapper">
				<div class="top">
					<img src="img/my.png" class="user-head"/>
					<div class="info">
						<span class="username">
							jyzx
						</span>
						<span class="vip">
							黄金会员
						</span>
					</div>
					<div class="right-wrapper">
						<img src="img/youjiantou.png"/>
					</div>
				</div>
				<!--积分，优惠券，关注start-->
				<div class="info-wrapper">
					<div class="item">
						<span class="title">积分</span>
						<span class="number">100</span>
					</div>
					<div class="item">
						<span class="title">优惠券</span>
						<span class="number">100</span>
					</div>
					<div class="item">
						<span class="title">关注</span>
						<span class="number">100</span>
					</div>
				</div>
				<!--积分，优惠券，关注end-->
				<!--<!--我的订单，待付款，代收货，待评价，售后服务start-->
				<!--<div class="info2-wrapper">
					<div class="item1">
						<img src="img/dingdan.png" class="title1"/>
						<span class="s">我的订单</span>
					</div>
					<div class="item1">
						<img src="img/待付款.png"  class="title1"/>
						<span class="s">待付款</span>
					</div>
					<div class="item1">
						<img src="img/待收货.png" class="title1"/>
						<span class="s">待收货</span>
					</div>
					<div class="item1">
						<img src="img/待评价.png" class="title1"/>
						<span class="s">待评价</span>
					</div>
					<div class="item1">
						<img src="img/售后服务.png" class="title1"/>
						<span class="s">售后服务</span>
					</div>
				</div>-->
				<div class="my-order-wrapper">
					<div class="item">
						<img src="img/dingdan.png"/>
						<span class="">我的订单</span>
					</div>
					<div class="item">
						<img src="img/daifukuan.png"/>
						<span class="">待付款</span>
					</div>
					<div class="item">
						<img src="img/daipingjia.png"/>
						<span class="">待收货</span>
					</div>
					<div class="item">
						<img src="img/daishouhuo.png"/>
						<span class="">待评价</span>
					</div>
					<div class="item">
						<img src="img/shouhoufuwu.png"/>
						<span class="">售后服务</span>
					</div>
				</div>
				<!--我的订单，待付款，代收货，待评价，售后服务end-->
				<!--我的收藏...start-->
					<div class="collect-wrapper">
						<div class="item">
							<img src="img/aixin.png"/>
							<span class="title">我的收藏</span>
						</div>
						<div class="item">
							<span class="number">100</span>
							<span class="title">商品</span>
						</div>
						<div class="item">
							<span class="number">100</span>
							<span class="title">专题</span>
						</div>
						<div class="item">
							<span class="number">100</span>
							<span class="title">话题</span>
						</div>
					</div>
				<!--我的收藏...end-->
				<!--我的足迹start-->
					<div class="myfoot">
						<div class="left">
							<img src="img/wodezuji.png" class="wdzj"/>
							<span class="item">我的足迹</span>
						</div>
						<div class="right">
							<span class="number">10</span>
							<img src="img/youjiantou2.png" class="yjt"/>
						</div>
					</div>
				<!--我的足迹end-->
				<!--我的评价start-->
					<div class="my-estimate">
						<div class="left">
							<img src="img/wodepingjia.png" class="wdpj"/>
							<span class="item">我的评价</span>
						</div>
						<div class="right">
							<span class="number">10</span>
							<img src="img/youjiantou2.png" class="yjt"/>
						</div>
					</div>
				<!--我的评价end-->
				<!--地址管理start-->
					<div class="area-manage">
						<div class="left">
							<img src="img/dizhiguanli.png" class="dzgl"/>
							<span class="item">地址管理</span>
						</div>
						<div class="right">
							<img src="img/youjiantou2.png" class="yjt"/>
						</div>
					</div>
				<!--地址管理end-->
				<!--我的会员start-->
					<div class="my-vip">
						<div class="left">
							<img src="img/huangguan.png" class="vip"/>
							<span class="item">我的会员</span>
						</div>
						<div class="right">
							<span class="number">黄金会员</span>
							<img src="img/youjiantou2.png" class="yjt"/>
						</div>
					</div>
				<!--我的会员end-->
				<!--服务中心start-->
					<div class="service-center">
						<div class="left">
							<img src="img/fuwuzhongxin.png" class="fwzx"/>
							<span class="item">服务中心</span>
						</div>
						<div class="right">
							<img src="img/youjiantou2.png" class="yjt"/>
						</div>
					</div>
				<!--服务中心end-->
				<!--系统设置start-->
					<div class="system-settings">
						<div class="left">
							<img src="img/chilun.png" class="szzx"/>
							<span class="item">设置中心</span>
						</div>
						<div class="right">
							<img src="img/youjiantou2.png" class="yjt"/>
						</div>
					</div>
				<!--系统设置end-->
			</div>
			<!--我的结束-->
		</div>
		<!--中间部分结束-->
		
		<!--底部开始-->
		<div class="foot">
			<div class="item">
				<img src="img/shouye.png"/>
				<span>首页</span>
			</div>
			<div class="item">
				<img src="img/fenlei.png"/>
				<span>分类</span>
			</div>
			<div class="item">
				<img src="img/zhuanti.png"/>
				<span>专题</span>
			</div>
			<div class="item">
				<img src="img/my.png"/>
				<span>我的</span>
			</div>
		</div>
		<!--底部结束-->
	</body>
</html>
